// 响应式storage
import { App } from 'vue'
import Storage from 'responsive-storage'
import { routerArrays } from '@/layout/types'
import { responsiveStorageNameSpace } from '@/config'

export const injectResponsiveStorage = (app: App, config: ServerConfigs) => {
  const nameSpace = responsiveStorageNameSpace()
  const configObj = Object.assign(
    {
      // layout模式以及主题
      layout: Storage.getData('layout', nameSpace) ?? {
        layout: config.Layout ?? 'vertical',
        theme: config.Theme ?? 'default',
        darkMode: config.DarkMode ?? false,
        sidebarStatus: config.SidebarStatus ?? true,
        epThemeColor: config.EpThemeColor ?? '#4795EA'
      },
      configure: Storage.getData('configure', nameSpace) ?? {
        grey: config.Grey ?? false,
        weak: config.Weak ?? false,
        hideTabs: config.HideTabs ?? false,
        showLogo: config.ShowLogo ?? true,
        showModel: config.ShowModel ?? 'smart',
        multiTagsCache: config.MultiTagsCache ?? false
      }
    },
    config.MultiTagsCache
      ? {
          // 默认显示顶级菜单tag
          tags: Storage.getData('tags', nameSpace) ?? routerArrays
        }
      : {}
  )

  app.use(Storage, { nameSpace, memory: configObj })
}
